<template>
	<view class="content">
		<!-- 资料卡片 -->
		<view class="card p-20 m-b-20 flex-row space-around"  v-for="(item, index) in list" :key="index">
			<view class="info flex-row space-around" @click="goToDetailPage(item)">
				<!-- 左侧封面图 -->
				<view class="left">
					<image class="thumbnail" :src="item.dataCover" mode=""></image>
				</view>
				<!-- 右侧信息介绍 -->
				<view class="right text-left">
					<view class="title">{{item.dataTitle}}</view>
					<view class="two-ellipsis">{{item.dataBrief || '简介'}}</view>
				</view>
			</view>
			<view class="operation">
				<view class="collection-yes" v-if="item.isReceived == 1" >已领取</view>
				<view class="collection-no" v-else @click="changeCollection(item)">未领取</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
    data() {
        return {
            collection: 0,
			time: 0,
			form: [],
			list: []
        }
    },
	onLoad(val) {
		this.form = val
	},
	mounted() {
		this.getSubjectList()
	},
    methods: {
		getSubjectList(){
			uni.showLoading({
				title: 'loading'
			});
			this.request({
				url: `${this.baseUrl}/user/listByCategoryId`,
				data: {
					categoryId: Number(this.form.categoryId)
				},
				method: 'GET',
				success: (res) => {
					this.list = res
					for (let i = 0; i < this.list.length; i++) {
						this.list[i].dataCover = this.baseUrl + this.list[i].dataCover
						this.list[i].dataFile = this.baseUrl + this.list[i].dataFile
					}
					uni.hideLoading()
				},
				fail: function(error) {
					console.log(error);
				}
			})
		},
        // 收藏或取消
        changeCollection(item){
        	uni.showLoading({
        		title: 'loading'
        	});
        	this.request({
        		url: `${this.baseUrl}/user/save`,
        		data: {
        			dataId: item.id
        		},
        		method: 'POST',
        		success: (res) => {
					item.isReceived = 1
        			uni.showToast({
        			    title: '领取成功',
        			    icon: 'none',
        			    duration: 2000
        			});
        			uni.hideLoading()
        		},
        		fail: function(error) {
        			console.log(error);
        		}
        	})
        },
		goToDetailPage(item){
			wx.downloadFile({
				url: item.dataFile,
				success: function (res) {
					var Path = res.tempFilePath              //返回的文件临时地址，用于后面打开本地预览所用
					wx.openDocument({
						filePath: Path,
						success: function (res) {
							uni.hideLoading()
							// console.log('打开成功')
						}
					})
				},
				fail: function (res) {
					console.log(res);
				}
			})
		}
    }
}
</script>

<style lang="scss" scoped>
	.content{
		min-height: 100vh;
	}
	.card{
		background: #FFFFFF;
	}
	.info{
		flex: 0 0 75%;
		align-items: flex-start;
	}
	.operation{
		flex: 0 0 20%;
		text-align: center;
		font-size: 24rpx;
		font-weight: 600;
		line-height: 50rpx;
	}
	.operation view{
		width: 120rpx;
		height: 50rpx;
		border-radius: 50rpx;
	}
	.collection-no{
		background: #ff5d5d;
		color: #FFFFFF !important;
	}
	.collection-yes{
		background: #e0e0e2;
	}
	.left{
		flex: 0 0 30%;
		height: 220rpx;
		position: relative;
		border-radius: 10rpx;
		overflow: hidden;
	}
	.thumbnail{
		width: 100%;
		height: 100%;
	}
	.right{
		flex: 0 0 60%;
		font-size: 24rpx;
		font-weight: 400;
		line-height: 40rpx;
		color: #333333;
	}
	.right .title{
		font-weight: 600;
		font-size: 30rpx;
		margin-bottom: 15rpx;
	}
</style>
